<div class="content-section-flex">
  <button lv-button (click)="confirm()">Confirm</button>
  <button lv-button (click)="info()">Information</button>
  <button lv-button (click)="success()">Success</button>
  <button lv-button (click)="error()">Error</button>
  <button lv-button (click)="warning()">Warning</button>
  <button lv-button (click)="custom()">Custom</button>
</div>

<ng-template #contentTpl>
  <div style="color: red">Custom content template.</div>
</ng-template>

<ng-template #warningContentTpl>
  <lv-group lvDirection="vertical" lvGutter="16px">
    <div style="color: red">Are you sure you want to delete the data source?</div>
    <label lv-checkbox [(ngModel)]="warningConfirm" (ngModelChange)="modalCheckBoxChange($event)">
      Delete is not recoverable, please proceed with caution.
    </label>
  </lv-group>
</ng-template>
